{% extends "kjs/eagleye/templates/base.html" %}

{% block common_css %}
    {{ block.super }}
    <style type="text/css">
        div.eagleyeContent {
            width:1024px;
            min-width:1024px;
            margin:0 auto;
        }
        div#eagleye_head {
            background-color:#00bfff;
        }
        div#eagleye_body {
            background:url('{{ STATIC_URL }}commons/background/8f1f1_background.png');
        }
        div.eagleyeBody {
            min-height:600px;
        }
        div#eagleye_foot {
            background-color:#333333;
        }

        div#eagleye_kjssoft_login {
            border:1px solid silver;
            background-color:#dcdcdc;
        }
        .formTitle {
            font-size:28px;
        }
    </style>
{% endblock %}

{% block body %}
    <div id="eagleye_head">
        <div class="eagleyeHead eagleyeContent">
            {% block eagleye_head %}
                {% include "kjs/eagleye/templates/widgets/head.html" %}
            {% endblock %}
        </div>
    </div>
    <div id="eagleye_body">
        <div class="eagleyeBody eagleyeContent">
            {% block eagleye_body %}
                <div id="eagleye_form_body">
                    <div id="eagleye_action_form">
                        {% if binds %}
                            <style type="text/css">
                                div#eagleye_action_form_tabs {
                                    margin:0;
                                    padding:0;
                                    border-radius:0;
                                    background:#00bfff;
                                    font-family:"Helvetica Neue", "Hiragino Sans GB", "Segoe UI", "Microsoft Yahei", "微软雅黑", Tahoma, Arial, STHeiti, sans-serif;
                                }
                                div#eagleye_action_form_tabs ul.ui-tabs-nav {
                                    background:none;
                                    border:0 solid white;
                                    border-radius:0;
                                    height:48px;
                                    padding:0;
                                    margin:0;
                                }
                                div#eagleye_action_form_tabs ul.ui-tabs-nav li {
                                    width:50%;
                                    height:100%;
                                    border:0 solid white;
                                    border-radius:0;
                                    margin:0;
                                    padding:0;
                                }
                                div#eagleye_action_form_tabs ul.ui-tabs-nav li a {
                                    margin:0;
                                    padding:0;
                                }
                                div#eagleye_action_form_tabs ul.ui-tabs-nav li.ui-state-focus a {
                                    outline:none;
                                    border:0 solid white;
                                }
                                div#eagleye_action_form_tabs ul.ui-tabs-nav li a div {
                                    width:191px;
                                    height:48px;
                                    line-height:48px;
                                    text-align:center;
                                }
                                div#eagleye_action_form_tabs .ui-tabs-active {
                                    background:#00bfff;
                                }
                                div#eagleye_action_form_tabs .ui-state-default a {
                                    color:#00bfff;
                                }
                                div#eagleye_action_form_tabs .ui-tabs-active a {
                                    color:white;
                                }
                                div#eagleye_action_form_tabs .ui-state-hover a {
                                    color:#87ceeb;
                                }
                            </style>
                            <div id="eagleye_action_form_tabs" class="fontFamily">
                                {% block eagleye_action_form_tabs %}
                                {% endblock %}
                            </div>
                            <script type="text/javascript">
                                $(document).ready(function(){
                                    $("div#eagleye_action_form_tabs").tabs({
                                    });
                                });
                            </script>
                        {% else %}
                            {% block eagleye_action_form %}
                            {% endblock %}
                        {% endif %}
                    </div>
                    <div id="eagleye_apps_show">bbb</div>
                </div>
                <style type="text/css">
                    div#eagleye_form_body {
                        padding:20px 0;
                    }
                    div#eagleye_apps_show {
                        background:#2e8b57;
                    }
                    div#eagleye_action_form {
                        float:right;
                        width:384px;
                    }
                </style>
            {% endblock %}
        </div>
    </div>
    <div id="eagleye_foot">
        <div class="eagleyeFoot eagleyeContent">
            {% block eagleye_foot %}{% endblock %}
        </div>
    </div>
{% endblock %}